<div class="widgets">

  <div class="row">
    <div class="col-md-12">
      <sa-card title="Inline Form" baCardClass="with-scroll">
        <box-inline-form></box-inline-form>
      </sa-card>
    </div>
  </div>

  <div class="row">
    <div class="col-md-6">
      <div>
        <sa-card title="Basic Form" baCardClass="with-scroll">
          <box-basic-form></box-basic-form>
        </sa-card>
      </div>

      <div>
        <sa-card title="Horizontal Form" baCardClass="with-scroll">
          <box-horizontal-form></box-horizontal-form>
        </sa-card>
      </div>
    </div>
    <div class="col-md-6">
      <div>
        <sa-card title="Form Without Labels" baCardClass="with-scroll">
          <box-without-labels-form></box-without-labels-form>
        </sa-card>
      </div>
      <div>
        <sa-card title="Block Form" baCardClass="with-scroll">
          <box-block-form></box-block-form>
        </sa-card>
      </div>
    </div>
  </div>
  <div class="row">
    <div class="col-md-6">
      <sa-card title="Picture Uploader" baCardClass="with-scroll">
        <sa-picture-uploader [(ngModel)]="picture"></sa-picture-uploader>
      </sa-card>
    </div>
  </div>
</div>
